<!--
 * @Description:
 * @Author: zhaolei
 * @Date: 2023-04-11 11:12:29
-->
<template>
  <el-dialog
    title="编辑宠物信息"
    :visible.sync="visible"
    width="60%"
    append-to-body
  >
    <commonForm
      v-if="visible"
      :id="id"
      ref="commonForm"
      action="edit"
      page="baseFile"
    ></commonForm>
    <div class="flex-end">
      <el-button @click="visible = false">取消</el-button>
      <el-button
        class="btn"
        :loading="loading"
        type="primary"
        @click="confirm"
      >
        确定
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
import { mapGetters } from 'vuex';
import { tableOption } from '@/const/crud/pet/add';
import commonForm from './commonForm';
import { editObj } from '@/api/core/pet-file';
export default {
  name: 'addPopup',
  components: { commonForm },
  props: {
    id: {
      type: [Object, String],
    },
    value: {
      type: Boolean,
      default: false,
    },
    dataObj: { type: [Object] },
  },
  data() {
    return {
      form: {},
      loading: false,
      tableOption: tableOption(),
      fileList: [],
      isCropper: false,
    };
  },
  computed: {
    visible: {
      get() {
        return this.value;
      },
      set(val) {
        this.$emit('input', val);
      },
    },
    ...mapGetters(['userInfo', 'access_token']),
  },
  watch: {
    visible(val) {
      if (!val) {
        // this.$refs.commonForm.$refs.addForm &&
        //   this.$refs.commonForm.$refs.addForm.resetForm();
      } else {
        this.$nextTick(() => {});
      }
    },
  },
  methods: {
    transform(arr, target) {
      const that = this;
      const obj = {};
      arr.forEach((el) => {
        const temp = [];
        if (Array.isArray(target[el])) {
          target[el].forEach((v, k) => {
            const dic = that.$refs.commonForm[`${el}List`];
            const label = dic.find(
              (item) => item.attributeCode === v
            ).attributeName;
            temp.push({ code: v, value: label });
          });
          obj[el] = JSON.stringify(temp);
        }
      });
      return obj;
    },
    confirm() {
      this.$refs.commonForm.$refs.addForm.validate(async (valid, done) => {
        if (valid) {
          this.loading = true;
          try {
            const dataObj = { ...this.$refs.commonForm.form };
            const params = { ...dataObj };
            const nameArr = dataObj.$petType.split(' | ');
            params.typeCode = dataObj.petType[0] || '';
            params.varietyCode = dataObj.petType[1] || '';
            params.typeName = nameArr[0] || '';
            params.varietyName = nameArr[1] || '';
            // 其他特征移到上架信息了
            // if (this.validatenull(dataObj.otherCharacteristics)) {
            //   params.otherCharacteristics = JSON.stringify([]);
            // } else {
            //   params.otherCharacteristics = JSON.stringify([
            //     {
            //       code: dataObj.otherCharacteristics,
            //       value: dataObj.$otherCharacteristics,
            //     },
            //   ]);
            // }
            if (dataObj.isUnknownTime) {
              params.birthDay = null;
            } else {
              params.birthDay = dataObj.birthDay.substr(0, 10) + ' 00:00:00';
            }
            if (dataObj.receiveDate) {
              params.receiveDate =
                dataObj.receiveDate.substr(0, 10) + ' 23:59:59';
            }
            // 个性特点移到上架信息了
            // if (this.validatenull(dataObj.personality)) {
            //   params.personality = JSON.stringify([]);
            // } else {
            //   params = {
            //     ...params,
            //     ...this.transform(
            //       [
            //         'personality',
            //       ],
            //       dataObj
            //     ),
            //   };
            // }
            params.id = this.id;
            await editObj(params);
            this.$message.success('操作成功');
            this.$emit('success', true);
            done();
            this.loading = false;
            this.visible = false;
          } catch (error) {
            done();
            this.loading = false;
            throw new Error(error);
          }
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
// ::v-deep {
//   .avue-upload {
//     position: relative;
//     width: 100%;
//     .avue-upload__avatar {
//       width: 200px;
//       height: 162px;
//       line-height: 162px;
//     }
//   }
//   .el-collapse-item__header {
//     margin-bottom: 0;
//   }
// }
</style>
